﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" Inherits="Web.Account.Login" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <link rel="SHORTCUT ICON" href="../Images/favicon.jpg" />
    <title>Xtablish CRM / Login</title>
    <link rel="stylesheet" type="text/css" href="../CSS/style.css" />
    <link rel="stylesheet" type="text/css" href="../CSS/bootstrap.css" />
    <link href="../CSS/Fonts.css" rel='stylesheet' type='text/css' />
    <script src="../JS/jquery.min.js"></script>
    <script src="../JS/bootstrap.min.js"></script>
</head>
<body class="bk-body">
    <form id="Form1" runat="server" class="form login-form form-horizontal">
        <div class="navbar navbar-fixed-top">
            <div class="navbar-inner">
                <div class="container-fluid">
                    <a data-target=".nav-collapse" data-toggle="collapse" class="btn btn-navbar">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </a>
                    <a class="brand">
                        <img width="150px" class="img-responsive" alt="Thinking Notes CRM" src="../Images/logo_green.png" />
                    </a>
                </div>
            </div>
        </div>
        <div class="container">
            <div id="login-wraper" class="form-wraper">
                <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
                <telerik:RadWindowManager ID="RadWindowManager1" runat="server">
                    <Windows>
                        <telerik:RadWindow runat="server" NavigateUrl="Dialog1.aspx" ID="Window1"></telerik:RadWindow>
                    </Windows>
                </telerik:RadWindowManager>
                <legend>Sign in</legend>
                <div class="body">
                    <div class="control-group">
                        <label class="control-label">Username</label>
                        <div class="controls">
                            <asp:TextBox class="form-control" runat="server" ID="txtUsername" placeholder="Username" onkeypress="isPressEnter(event)" />
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">Password</label>
                        <div class="controls">
                            <asp:TextBox class="form-control" type="password" runat="server" ID="txtPassword" placeholder="Password" onkeypress="isPressEnter(event)" />
                        </div>
                    </div>
                </div>
                <div class="footer">
                    <label class="checkbox inline">
                        <input type="checkbox" value="option1" id="inlineCheckbox1" />
                        Remember me
                    </label>
                    <asp:Button class="btn btn-success" runat="server" ID="btnLogin" Text=" Login " OnClick="btnLogin_Click"></asp:Button>
                    <p>
                        <a href="#" class="fg-pass">Forgot your password?</a>
                    </p>
                </div>
            </div>
            <div id="forgot-wraper" class="form-wraper" style="display: none;">
                <legend>Forgot Password</legend>
                <div class="body">
                    <div class="control-group">
                        <label class="control-label">Username</label>
                        <div class="controls">
                            <asp:TextBox type="text" class="form-control" runat="server" ID="txtForgotUserName" placeholder="Username" onkeypress="isPressEnter(event)" />
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="control-label">Email</label>
                        <div class="controls">
                            <asp:TextBox class="form-control" type="email" runat="server" ID="txtEmail" placeholder="Email" onkeypress="isPressEnter(event)" />
                        </div>
                    </div>
                </div>
                <div class="footer">
                    <asp:Button ID="btn_submit" class="btn btn-success" Text=" Submit " runat="server" OnClick="btnSubmit_Click" />
                    <input type="button" class="btn" value="Back" id="back-button" />
                </div>
            </div>
        </div>
    </form>
    <script>
        $(function () {
            $('#login-wraper .fg-pass').click(function () {
                document.getElementById("login-wraper").style.display = "none";
                document.getElementById("forgot-wraper").style.display = "block";
            });
            $('#back-button').click(function () {
                document.getElementById("login-wraper").style.display = "block";
                document.getElementById("forgot-wraper").style.display = "none";
            });
        });

        function isPressEnter(evt) {
            var charCode = (evt.which) ? evt.which : event.keyCode
            if (charCode == 13) {
                if ($("#login-wraper").css('display') == 'none') {
                    var clickButton = document.getElementById('<%= btn_submit.ClientID %>');
                    clickButton.click();
                }
                if ($("#forgot-wraper").css('display') == 'none') {
                    var clickButton = document.getElementById('<%= btnLogin.ClientID %>');
                    clickButton.click();
                }
            }

        }
    </script>
</body>
</html>
